<template>
  <div class="template-index-Lu">
    <commpVxeTable
          :isCanWrap="true"
          :conditionBtnRow="true"
          :key="reCommpVxeTable"
          :config="dataTableConfig"
          :columns="columnsVxe"
          :formItem="formItem"
          @checkboxChange="checkboxChange"
          ref="administrativeOffice"
          @searchEvent="searchEvent"
          @resetEvent="resetEvent"
          >
          <template v-slot:operation_fcykssj="{row}" data-desc="审评时间">
            <span>
              {{ row.fcykssj }} 至 {{ row.fcyjssj }}
            </span>
          </template>
          <template v-slot:operation_fjcyxm="{row}" data-desc="姓名">
              <span style="padding-right: 21;" v-if="row.fjcyxm&&row.fjcyxm.length == 2">
                  <span v-for="(trem,tI) in row.fjcyxm.split('')" :key="tI" >
                      {{trem}}
                      <span v-if="tI+1 !== row.fjcyxm.split('').length">&nbsp;&nbsp;</span>
                  </span>
              </span>
              <span style="padding-right: 21;" v-else>{{ row.fjcyxm }}</span>
          </template>
          <template v-slot:operation_fdbr="{row}" data-desc="姓名">
              <span style="padding-right: 21;" v-if="row.fdbr&&row.fdbr.length == 2">
                  <span v-for="(trem,tI) in row.fdbr.split('')" :key="tI" >
                      {{trem}}
                      <span v-if="tI+1 !== row.fdbr.split('').length">&nbsp;&nbsp;</span>
                  </span>
              </span>
              <span style="padding-right: 21;" v-else>{{ row.fdbr }}</span>
          </template>
          <template v-slot:operation_ffsrmc="{row}" data-desc="发送人">
              <span style="padding-right: 21;" v-if="row.ffsrmc&&row.ffsrmc.length == 2">
                  <span v-for="(trem,tI) in row.ffsrmc.split('')" :key="tI" >
                      {{trem}}
                      <span v-if="tI+1 !== row.ffsrmc.split('').length">&nbsp;&nbsp;</span>
                  </span>
              </span>
              <span style="padding-right: 21;" v-else>{{ row.ffsrmc }}</span>
          </template>
          <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
              <a-form layout="inline">
                  <a-form-item>
                      <a-button class="green-btn" @click="reviseClick(row)" icon="eye">查看</a-button>
                  </a-form-item>
              </a-form>
          </template>
      </commpVxeTable>
    <printInspector ref="printRefName" />
  </div>
</template>
<script>
import  commpVxeTable   from '@/components/commp-vxe-table/commp-vxe-table.vue'
import printInspector from './printInspector-new.vue'
import YchConstant from "@/api/YchConstant"; //接口模块配置项
import {
  queryBatchYbjcyList,
  downMyQm
} from "../api/prepareinspectorm";
export default {
  components: {
      commpVxeTable,printInspector
  },
  props: {
    routeName:{
        type:String,
        default:'',
        required:false,
    },
  },
  data() {
    return {
          reCommpVxeTable: '',
          dataTableConfig: {
              api: YchConstant.SPZX_SPCY + this.routeName,
              rowId: 'id',
              paramet: {}
          },
          columnsVxe: [
            {
              type: "checkbox",
              width: 60,
              fixed: 'left'
            },{
              field: "fjcyxm",
              title: "姓名",
              width: 100,
              titleInterval:true,
              slots: {
                  default:'operation_fjcyxm',
              }
              // width: "150",
            },
            {
              field: "fgzdw",
              title: "工作单位",
              // width: "150",
            },
            {
              field: "fqymc",
              title: "被审评单位",
              // width: 150,
            },
            {
              field: "fjclx",
              title: "审评类型",
              width: 150,
            },
            {
              field: "fjcsj",
              title: "审评时间",
              // width: "180",
            },
            {
              field: "fhjmc",
              title: "环节名称",
              width: 100,
            },
            {
              field: "fdbr",
              title: "办理人",
              width: 100,
              slots: {
                  default:'operation_fdbr',
              }
              // width: "150",
            },
            {
              field: "ffsrmc",
              title: "发送人",
              width: 100,
              slots: {
                  default:'operation_ffsrmc',
              }
              // width: "150",
            },
            {
              field: "ffssj",
              title: "发送时间",
              width: 170,
              // width: "150",
            },
            {
              field: "fblzt",
              title: "办理状态",
              width: 100,
              // fixed:"right",
              // width: "150",
            },
            {
              field: "operate",
              title: "操作",
              fixed: "right",
              width: 100,
              slots: {
              // 使用插槽模板渲染
                  default: 'operation_btn',
              },
            },
          ],
          formItem: [
              {
                  label: '关键字',
                  model: 'gjz',
              },
          ],
          idList: [],
          formData: {},
      }
  },
  methods: {
      // 勾选
      checkboxChange(val){
          //console.log('已选择',val)
          this.idList = []
          if(val.length){
              val.forEach(item => {
                  this.idList.push(item.id)
              });
          }
      },
      // 搜索
      searchEvent(){
          this.dataTableConfig.paramet = {
              ...this.dataTableConfig.paramet,
          }
      },
      // 重置
      resetEvent(){
          //console.log('重置')
          this.reCommpVxeTable = Date.now()
          this.dataTableConfig.paramet = {
              ...this.dataTableConfig.paramet,
          }
      },
      reviseClick(row){
        //console.log(row)
        queryBatchYbjcyList({ids:row.ybid.toString()}).then(res=>{
          if(res.code == 200){
            var signatureData = []
            var list = []
            res.result.forEach((item,index) => {
                downMyQm({id:item.fzzid}).then(res=>{
                    if(res.code){
                      item['signature'] = null
                    } else {
                      item['signature'] = "data:image/png;base64," +
                      btoa( new Uint8Array(res).reduce( (data, byte) => data + String.fromCharCode(byte), "" ))
                    }
                    list[index] = item
                    if(signatureData.indexOf(item.id) == -1){
                      signatureData.push(item.id)
                    }
                    // if(signatureData.length == this.checkboxArr.length){
                      this.$refs.printRefName.getData(list)
                    // }
                })
            });
          }else{
            this.$message.warning(res.messsage)
          }
        })
      },
    // 弹窗关闭
    success(){
      // 刷新表格 清空id数组
      this.$refs.administrativeOffice.resetEvent()
      this.idList = []
    },
  },
}
</script>
